<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> 追加节点 </title>
</head>
<body>
    <ul>
        <li>元素1</li>
        <li>元素2</li>
        <li>元素3</li>
    
    </ul>
    <button>删除</button>
    
</body>
<script src="../lib/font/jquery.min.js"></script>
<script>
    $(function(){
        let li = $('<li>元素4</li>');
       // $("ul li:eq(1)").replaceWith(li);
       $('ul li:eq(1)').clone(false).insertAfter($('ul > li:eq(1)'));

       // $("ul").append(li);

      // $('ul').prepend(li);
      // li.prependTo($('ul'));


      //同辈元素操作
    //   $('ul > li:eq(1)').after(li);
    //   li.insertAfter($('ul > li:eq(1)'));


    //   $('ul > li:eq(1)').before(li);
    //   li.insertBefore($('ul > li:eq(1)'));

    // $('button').click(function(){
    //     $('ul').remove();
    //     $('ul').empty();
    // })
        
    });
</script>
</html>